<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>首页轮播 - 管理后台</title>
    <link rel="stylesheet" href="/static/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/css/public.css" media="all"/>
</head>
<body class="childrenBody">
<div class="layui-col-md12">
    <blockquote class="layui-elem-quote title">
        <div class="layui-inline layui-float-right">
            <a class="layui-btn layui-btn-sm layui-btn-normal addAd_btn" href="javascript:void(0);">添加轮播图</a>
        </div>
        <span class="layui-breadcrumb">
            <a href="javascript:void(0);">系统设置</a>
            <a><cite>首页轮播</cite></a>
        </span>
    </blockquote>
    <table id="bannerList" lay-filter="bannerList" class="layui-table"></table>
    <script type="text/html" id="bannerListTBar">
        <a class="layui-btn layui-btn-xs" lay-event="delete">删除</a>
    </script>
    <script type="text/html" id="bannerImage">
        <img src="/{{ d.image }}"/>
    </script>
</div>
<script src="/static/layui.js"></script>
<script>
    layui.use(['element', 'jquery', 'layer', 'table', 'form'], function () {
        var layer = layui.layer,
            $ = layui.jquery,
            table = layui.table;
        var tableIns = table.render({
            elem: '#bannerList',
            url: '{:url("system/banner")}',
            cellMinWidth: 95,
            id: "bannerListTable",
            cols: [[
                {field: 'name', title: '名称', minWidth: 100, align: "center"},
                {field: 'image', templet: '#bannerImage', title: '图片', minWidth: 100, align: "center"},
                {field: 'create_time', title: '添加时间', minWidth: 100, align: "center"},
                {title: '操作', templet: '#bannerListTBar', fixed:'right', width:150, align:'center'}
            ]]
        });
        $('.childrenBody').on('click','img',function(){
            var img = new Array;
            img.push({src:$(this).attr('src')});
            layer.photos({
                photos: {data:img},
                anim: 5
            });
        });
        $(".addAd_btn").click(function(){
            var index = layui.layer.open({
                title : "添加轮播图",
                type : 2,
                content : "{:url('system/addBanner')}",
                area: ['500px', '400px']
            });
        });
        table.on('tool(bannerList)', function (obj) {
            var layEvent = obj.event,
                data = obj.data;
            if (layEvent === 'delete') {
                layer.open({
                    content:'确定删除该轮播图么？删除后不可恢复',
                    btn: ['确定', '取消'],
                    yes: function(){
                        var index = layer.load(1);
                        $.get('{:url("system/deleteBanner")}?id=' + data.banner_id,function (data) {
                            if(data.code == 0){
                                layer.close(index);
                                layer.msg(data.msg, {
                                    time: 3000,
                                    icon:1
                                }, function(){
                                    window.location.reload();
                                });
                            }else{
                                layer.close(index);
                                layer.msg(data.msg,{icon:5,shift:6});
                            }
                        });
                        return true;
                    },
                    btn2: function(){
                        return true;
                    }
                });
            }
        });
    });
</script>
</body>
</html>